import {
  Form,
  Input,
  Select,
  Cascader,
  DatePicker,
  InputNumber,
  TreeSelect,
  Switch,
  Button
} from 'antd';
const FormC = ({formD}) => {
  const onFormLayoutChange = (changeV,allValues)=>{
    console.log('value',changeV,allValues)
  }
  const FormItem = Form.Item;
  return ( 
    <>
      <Form
        name="basic"
        labelCol={{ span: 8 }}
        wrapperCol={{ span: 16 }}
        initialValues={{ remember: true }}
        layout="horizontal"
        onValuesChange={onFormLayoutChange}
      >
        <FormItem
          label="Username"
          name={['formD','value1']}
          rules={[{ required: true, message: 'Please input your username!' }]}
        >
          <Input />
        </FormItem>
        <FormItem label="Select" name={['formD','value2']}>
          <Select>
            <Select.Option value="demo">Demo</Select.Option>
          </Select>
        </FormItem>
        <FormItem label="TreeSelect" name="TreeSelect">
          <TreeSelect
            treeData={[
              { title: 'Li ght', value: 'light', children: [{ title: 'Bamboo', value: 'bamboo' }] },
            ]}
          />
        </FormItem>
        <FormItem label="Cascader" name="Cascader">
          <Cascader
            options={[
              {
                value: 'zhejiang',
                label: 'Zhejiang',
                children: [
                  {
                    value: 'hangzhou',
                    label: 'Hangzhou',
                  },
                ],
              },
            ]}
          />
        </FormItem>
        <FormItem label="DatePicker" name="DatePicker">
          <DatePicker />
        </FormItem>
        <Form.Item label="InputNumber" name="InputNumber">
          <InputNumber />
        </Form.Item>
        <Form.Item label="Switch" name="Switch">
          <Switch />
        </Form.Item>
        <Form.Item label="Button">
          <Button>Button</Button>
        </Form.Item>
      </Form>
    </>
  );
};
export default FormC;
